<template>
  <!-- 需要设置编辑区域高度 -->

    <div class="bk_full_wapper bk_padding_le_rg">
      <grid-page
        :grid-data="gridData"
        @checkboxRecords="getCheckboxRecords"
      >
      <div slot="toolBarSlot">我是测试</div>
      </grid-page>
      <vxe-modal v-model="modalshow" resize height="80%" width="80%">
            <sortable/>
      </vxe-modal>
    </div>
</template>

<script>

import gridPage from '@/components/TablePage/gridPage2'
import sortable from './sortable'
// import temp from '@/components/TablePage/temp'
export default {
  components: { gridPage,sortable},
  data() {
    return {
      show: false,
      modalshow:true,
      gridData: {
        model: '',
        options:{
          treeConfigKey: '',
          checkType: 'check',//check // no
          isEdit: false,//是否行内编辑
          isIndex:true,//是否有索引
          isSort:false,//是否拖拽排序
          tableToolbar: {
            zoom: true,
            buttons: [
              { code: 'btnDemo1', name: '追加按钮1', icon: 'fa fa-plus', handler: this.demoMethod },
              { code: 'btnDemo2', name: '追加按钮2', icon: 'fa fa-plus' },
              { code: 'btnDemo3', name: '追加按钮3', icon: 'fa fa-plus','handler':this.opendragGrid },
            ],
            tools:[{name:'测试',handler:this.testBtnClick},{isSlot:true,name:'toolBarSlot'}]
          },
          shieldBtn: false
        },
        settings: {
          allAlign: 'left',
          resizable: true
        },
        checkBoxData:[]
      }
    }
  },
  created() {
    this.show = true
  },
  mounted() {

  },
  methods: {
    testBtnClick(){
      this.$$message({type:'success',message:'测试点击'})
    },
    opendragGrid(){

    },
    demoMethod:function(val) {
      console.log('11111111111')
    },
    getCheckboxRecords(val) {
      this.checkBoxData = val
      console.log(this.checkBoxData)
    }
  }
}

</script>

<style scoped>
.col-page {
  margin: -15px 0.5px 0.5px 0.5px;
}

.el-card__body {
  padding: 0.5px;
}

.formSearch {
  margin-left: -20px;
}

.Wrap {
  clear: both;
}

.searchBox {
  float: right;
}

.el-form-item {
  padding-top: 5px;
}

.end-date {
  margin-left: 10px;
}

.hello {
  height: 900px;
}
</style>

